前端就是用户角度能看的见的包括美工、网站设计等通俗的就是文字、图片、视频等一系列用户能看的见的对其制作的工作统称“前端”，前端是一个大的概念。（一般就是文字、图片、视频）

后端就是负责后台数据的人员，比如抖音前端就包括“抖音企业号商家管理后台、抖音客服系统、抖音云控系统、抖音小店后台管理系统、抖音快速任务点赞系统、抖音SCRM系统”

网站、系统管理、APP、小程序、数据可视化、智能电视、桌面应用、网页游戏、工具和后端

1：pc端的页面制作与动画特效（HTML+CSS网页搭建；Photoshop切图流程；CSS3动画特效）可从事初级Web前端开发工程师，主要进行pc端网页的布局制作与样式设计实现，能够配合UI设计师进行项目开发（pc端页面制作工程师4k-5k）；

2：移动端页面制作与响应式实现（移动端概念与布局；响应式设计与实现）获得初级web前端工程师，主要进行移动端网页的布局制作与样式设计实现，可适配各种手机尺寸，并能利用响应式进行移动端与pc端适配（移动端页面适配工程师6k-7k）；

3：JavaScript与jQuery开发（JavaScript开发；jQuery开发）获得中级web前端工程师，主要进行页面行为交互，实现网站中常见特效，如录播图、选项卡、拖拽、并能适配UI和后端进行项目开发（JavaScript开发工程师8k-10k）；

4：H5高级框架技术开发（Vue框架开发；Angular框架开发；React框架开发）获得中级Web前端工程师，主要进行框架开发项目，实现单页面应用开发可以完成复杂的数据交互应用场景具备独立开发项目的能力（前端框架开发工程师10k-13k）；

5：全栈前后端技术开发（Node.js技术；其他后端技术）获得高级Web前端工程师，主要进行前后端全栈式开发，能够独立完成一个中小型项目的前后台，对于网站开发有着非常熟练的编程能力（全栈开发工程师/Web高级开发工程师14k-18k）；

6：混合应用技术开发（微信小程序开发；React Native技术）获得高级Web前端工程师，主要进行混合App项目开发能够实现多端开发并拥有多端开发能力，整合资源实现跨平台跨设备的架构能力（混合开发工程师/Web高级开发工程师18k-22k）；

7：H5大前端技术开发（Electron技术；Flutter技术；数据可视化技术）获得Web前端专家称号，主要进行前端各领域涉猎，多元产品主导项目的实现，能够拥有复杂问题的解决能力，并能提出可建设性解决方案（Web前端技术专家23k-30k）；

8：H5架构技术开发（安全及性能优化；开发工具及服务器技术）获得Web前端专家称号主要进行前端项目架构和项目把控，能够解决网站出现的突发状况、能够改进网站性能至极，拥有大型网站、大量高并发访问量等开发经验（资深Web前端架构师30k以上）

从小白的角度去看看待这个问题

答：网页是因特网上可以访问的信息页。当我们在因特网上浏览时，电脑屏幕上显示的内容就是网页。网页可以包含文件、图像和动画，也可以包含内嵌的对其他网站有引导作用的广告条目。通过网页，我们可以用超文本的方式去访问连接在一起的任何内容。

登陆到一个网站，我们所看到的第一个网页称为主页。

网页上的所有内容都是保存到网络服务器中的，

所有的内容也都是需要上传到网络服务器上，这样用户才可以进行访问。

做一个自己搭建的网站, 其实就需要三步, 第一需要有域名, 第二需要有空间, 第三需要有运行的程序. 三者缺一不可,

网站是由一个个网页组成。我们在浏览器上面看到的每一个页面就是网页，这些 相关的 网页组成一个网站。像知乎上很多个页面能组成知乎这个庞大的网站。 网站可以只包含一个网页。

前端 我们打开浏览器看到的，都是网站的前端。它们是直接给用户呈现出来的，换言之，前端就是专门给用户看到的部分。 我们知道，一个个网页是由代码编写的。前端，就是用 html，css，javascript三种语言组成。用这三种语言，就可以编写出各种花里胡哨的网页。 简单介绍一些这三种语言，如果把网站比作一个房子。 ①html，就是房子的砖和瓦。网站是由文字，图片堆砌而成，那么html就是往网站上添加文字图片等等。 ②css，就是房子的美观度。我们要改变文字的大小，文字的颜色，图片的大小。都要用css来完成。 ③javascript，就是人与房子的交互。比如点击一个按钮，点击后会出现什么效果，要用Javascript来完成。比如，点击按钮后跳转到另一个网页。

网页，是指网站中的任何一页面，通常是HTML（标准通用标记语言下的一个应用）格式（文件扩展名为html、或htm、或asp、或aspx、或php、或jsp等）。

1.标题

在网页或者网站的单独文章中，通常会有一个引人注目的标题，告诉访问者网站的名称和文章主题。现在许多的网页设计师多使用图像而不是文本标题。

2.文字

过大的字在显示器中显示时线条的显示不够平滑、颜色也不要使用得太过复杂，以免造成影响用户视觉。因此正确调整文字大小可以使文本排列更加生动，并取得更好的效果。

3.图片

今天看到的丰富多彩的网页，都是因为网页中有了图像，由此可见图像在网页中的重要性。用于网页上的图片一般为JPG和GIF格式的，即以.jpg和.gif为后缀的文件。

4.超链接

网页中的链接又可分为文字链接和图像链接两种，只要访问者用鼠标来单击带有链接的文字或者图像，就可自动链接到对应的其他文件，这样才让网页能够链接成为一个整体，超链接也是整个网络的基础。

5.表单

表单是一种可在访问者和服务器之间进行信息交互的技术，使用表单可以完成搜索、登录、发送邮件等交互功能。

网页分为静态网页、动态网页，其工作原理分别如下：

1、静态网页的工作原理：用户在浏览器的地址栏输入要访问的地址并回车，触发这个浏览请求；浏览器将请求发送到Web服务器；Web服务器接受这个请求，并根据请求文件的后缀名判定是否为HTML文件；Web服务器从服务器硬盘的指定位置或内存中读取正确的HTML文件然后将它发送给请求浏览器；用户的浏览器解析这些HTML代码并将它显示出来。

2、动态网页的工作原理：当用户请求的是一个动态网页时，服务器要做更多的工作才能把用户请求的信息发送回去，服务器一般按照以下步骤进行工作：

（1）服务器端接受请求。

（2）Web服务器从服务器硬盘指定的位置或内存中读取动态网页文件。

（3）执行网页文件的程序代码，将含有程序代码的动态网页转化为标准的静态页面（HTML）。

（4）Web服务器将生成的静态页面代码发送给请求浏览器。

万维网，常简称为Web，中文名字为“万维网”，"环球网"等。

分为Web客户端和Web服务器程序。 WWW可以让Web客户端（常用浏览器）访问浏览Web服务器上的页面。 是一个由许多互相链接的超文本组成的系统，通过互联网访问。

在这个系统中，每个有用的事物，称为一样“资源”；并且由一个全局“统一资源标识符”（URI）标识；这些资源通过超文本传输协议（Hypertext Transfer Protocol）传送给用户，而后者通过点击链接来获得资源。

万维网并不等同互联网，万维网只是互联网所能提供的服务其中之一，是靠着互联网运行的一项服务。

万维网、因特网的区别：

1.因特网于1969年诞生于美国。最初名为“阿帕网”（ARPAnet）是一个军用研究系统，后来又成为连接大学及高等院校计算机的学术系统，则已发展成为一个覆盖五大洲150多个国家的开放型全球计算机网络系统，拥有许多服务商。

普通电脑用户只需要一台个人计算机用电话线通过调制解调器和因特网服务商连接，便可进入因特网。但因特网并不是全球唯一的互联网络。

2.万维网是无数个网络站点和网页的集合，它们在一起构成了因特网最主要的部分（因特网也包括电子邮件、Usenet以及新闻组）。

它实际上是多媒体的集合，是由超级链接连接而成的。我们通常通过网络浏览器上网观看的，就是万维网的内容。关于万维网以及浏览万维网的一些世界语术语，我将在以后所发的帖子中陆续作些介绍。

**HTTP协议（Hypertext Transfer Protocol，超文本传输协议）**是用于从WWW服务器传输超文本到本地浏览器的传送协议。它可以使浏览器更加高效，使网络传输减少。

我们在浏览器的地址栏里输入的网站地址叫做URL(UniformResourceLocator，统一资源定位符)。就像每家每户都有一个门牌地址一样，每个网页也都有一个Internet地址。当你在浏览器的地址框中输入一个URL或是单击一个超级链接时，URL就确定了要浏览的地址。浏览器通过超文本传输协议(HTTP)，将Web服务器上站点的网页代码提取出来，并翻译成漂亮的网页。因此，在我们认识HTTP之前，有必要先弄清楚URL的组成, 例如：http://www.xinzhiweike.com/wenda/index.htm 它的含义如下：

1.http://：代表超文本传输协议，通知microsoft.com服务器显示Web页，通常不用输入；

2.www：代表一个Web(万维网)服务器；

3.xinzhiweike.com/：这是装有网页的服务器的域名，或站点服务器的名称；

4.wenda/：为该服务器上的子目录，就好像我们的文件夹；

5.Index.htm:是文件夹中的一个HTML文件(网页)。

Internet的基本协议是TCP/IP协议，然而在TCP/IP模型最上层的是应用层(Applicationlayer)，它包含所有高层的协议。高层协议有：文件传输协议FTP、电子邮件传输协议SMTP、域名系统服务DNS、网络新闻传输协议NNTP和HTTP协议等。

HTTP协议不仅保证计算机正确快速地传输超文本文档，还确定传输文档中的哪一部分，以及哪部分内容首先显示(如文本先于图形)等。这就是你为什么在浏览器中看到的网页地址都是以“http://”开头的原因。

自WWW诞生以来，一个多姿多彩的资讯和虚拟的世界便出现在我们眼前，可是我们怎么能够更加容易地找到我们需要的资讯呢？当决定使用超文本作为WWW文档的标准格式后，于是在1990年，科学家们立即制定了能够快速查找这些超文本文档的协议，即HTTP协议。经过几年的使用与发展，得到不断的完善和扩展，目前在WWW中使用的是HTTP/1.0的第六版。

由于HTTP协议是基于请求/响应范式的(相当于客户机/服务器)。一个客户机与服务器建立连接后，发送一个请求给服务器，请求方式的格式为：统一资源标识符(URL)、协议版本号，后边是MIME信息包括请求修饰符、客户机信息和可能的内容。服务器接到请求后，给予相应的响应信息，其格式为一个状态行，包括信息的协议版本号、一个成功或错误的代码，后边是MIME信息包括服务器信息、实体信息和可能的内容。

许多HTTP通讯是由一个用户代理初始化的并且包括一个申请在源服务器上资源的请求。最简单的情况可能是在用户代理和服务器之间通过一个单独的连接来完成。在Internet上， HTTP通讯通常发生在TCP/IP连接之上。缺省端口是TCP80，但其它的端口也是可用的。但这并不预示着HTTP协议在Internet或其它网络的其它协议之上才能完成。HTTP只预示着一个可靠的传输。

这个过程就好像我们打电话订货一样，我们可以打电话给商家，告诉他我们需要什么规格的商品，然后商家再告诉我们什么商品有货，什么商品缺货。这些，我们是通过电话线用电话联系(HTTP是通过TCP/IP)，当然我们也可以通过传真，只要商家那边也有传真。

在WWW中，“客户”与“服务器”是一个相对的概念，只存在于一个特定的连接期间，即在某个连接中的客户在另一个连接中可能作为服务器。基于HTTP协议的客户/服务器模式的信息交换过程，它分四个过程：建立连接、发送请求信息、发送响应信息、关闭连接。这就好像上面的例子，我们电话订货的全过程。

其实简单说就是任何服务器除了包括HTML文件以外，还有一个HTTP驻留程序，用于响应用户请求。你的浏览器是HTTP客户，向服务器发送请求，当浏览器中输入了一个开始文件或点击了一个超级链接时，浏览器就向服务器发送了HTTP请求，此请求被送往由IP地址指定的URL。驻留程序接收到请求，在进行必要的操作后回送所要求的文件。在这一过程中，在网络上发送和接收的数据已经被分成一个或多个数据包(packet)，每个数据包包括：要传送的数据；控制信息，即告诉网络怎样处理数据包。TCP/IP决定了每个数据包的格式。如果事先不告诉你，你可能不会知道信息被分成用于传输和再重新组合起来的许多小块。

也就是说商家除了拥有商品之外，它也有一个职员在接听你的电话，当你打电话的时候，你的声音转换成各种复杂的数据，通过电话线传输到对方的电话机，对方的电话机又把各种复杂的数据转换成声音，使得对方商家的职员能够明白你的请求。这个过程你不需要明白声音是怎么转换成复杂的数据的。

域名：由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名称，用于在数据传输时标识计算机的电子方位（有时也指地理位置）；是互联网上企业/个人或机构间相互联络的网络地址。

网站空间：专业名词“虚拟主机”的意思。把一台运行在互联网上的服务器划分成多个“虚拟”的服务器，每一个虚拟主机都具有独立的域名和完整的Internet服务器（支持WWW、FTP、E-mail等）功能。

第一：html

最简单网站的网页是由html构成，这是最基本的，所以你必须去学html语言而且要精通。

第二：css样式

一般你学习的时候就要寻找div+css相关的教程，组要负责网页的排版布局，你不必学的精通。但要可以看懂代码。自己可以独立的修改网页布局。网页布局一直是前端设计师的难题，要兼容各种浏览器。

第四：javascript

javascript主要负责网页的客户端动态视觉效果，动态交互，数据异步交换，广告调用。但要学好并不容易，最起码会JS调用广告，起到优化网页布局的作用。同时还能获得收入。

第三：Dreamweaver

网站编辑工具，这里推荐大家学习Dreamweaver，是用来编辑网页，书写html代码，更改网页布局（CSS样式）。

第四：Fireworks或photoshop

主要要用于网站的图片制作。

第五:DOM文档对象，AJAX,数据库等

第五点内容要对于内容要有一定的了解，不必精通，但你要想成为一名合格网站的开发设计工程师这些都是要精通的。

第六：动态语言

动态网站开发的语言有很多，现在最流行的是php。其它的有asp，asp.net，jsp,‍phthon等等，